<template>
	<view class="selectBank">
		<i-search @clear="searchChange" @change="searchChange" placeholder="银行名称搜索" v-model="keyword" ></i-search>
		<i-scrollList :pageTotal="bankList.length"	:total="bankList.length" height="calc(100vh - 88rpx)">
			<view class="bank_item" v-for="(item, index) in bankList" :key="index" @click="selectItem(item)">
				{{item}}
			</view>
		</i-scrollList>
	</view>
</template>

<script lang="ts" setup>
	import {
		onLoad,
	} from '@dcloudio/uni-app'
	import {
		ref
	} from 'vue';
	import {
		getAuthBankList,
	} from "../../api/trilateral";
	
	const bankList = ref<any>([])
	const keyword = ref('')

	onLoad(()=> {
		getBankList()
	})
	
	const getBankList = async () => {
		const { data } = await getAuthBankList({ keywords: keyword.value })
		bankList.value = data
	}
	
	const searchChange = ()=> {
		getBankList()
	}

	const selectItem = (str: string) => {
		uni.$emit('bankDeposit', str)
		uni.navigateBack()
	}

</script>

<style lang="scss" scoped>
	.selectBank {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		.bank_item {
			margin-left: 32rpx;
			height: 88rpx;
			@include flexR;
			@include dfont;
			border-bottom: 1rpx solid #F5F5F7;
		}
	}
</style>